<template>
  <div id="container"></div>
</template>
<script>
import { Pie } from '@antv/g2plot';
export default {
  props: {
    currentTermId: {
      type: String,
    },
    currentClassId: {
      type: String,
    },
    studentNo: {
      type: String,
    },
    entryType: {
      type: String,
    },
  },
  data() {
    return {
      chart: null,
      loading: true,
    };
  },
  watch: {
    currentTermId() {
      if (this.entryType == 'student') {
        this.getScoreCountStat();
      } else if (this.entryType == 'teacher') {
        // this.getHomeworkStat();
      }
    },
    currentClassId() {
      if (this.entryType == 'student') {
        this.getScoreCountStat();
      } else if (this.entryType == 'teacher') {
        // this.getHomeworkStat();
      }
    }
  },
  mounted() {
    this.initChart();
    this.getHomework();
    // if (this.entryType == 'student') {
    //   this.getScoreCountStat();
    // } else if (this.entryType == 'teacher') {
    //   this.getHomeworkStat();
    // }
  },
  methods: {
    async initChart() {
      // 创建空图表容器
      this.chart = new Pie(document.getElementById('container'), {
        forceFit: true,
        data: [],
        meta: {
          range: {
            alias:'年份',
            range: [0, 100],
          },
          percent: {
            alias: '数量',
            formatter:(v)=>{return `${v}%`}
          }
        },
        angleField: 'range',
        colorField: 'percent',
        label: {
          visible: true,
          type: 'spider',
        },
      });
      this.chart.render();
    },
    // 学生作业批改统计
    async getScoreCountStat() {
      const res = await this.$request.get(`api/report/banji_score_count_stat?term_id=${this.currentTermId}&class_id=${this.currentClassId}&no=${this.studentNo}`);
      if (res.code == 1) {
        this.pieData = res.data || [];
      }
    },
    async getHomework() {
      const res = await this.$request.get(`api/report/teacher_homework_stat?term_id=1&class_id=1`);
      if (res.code == 1) {
        const transformedData = res.data || [];
        console.log(transformedData, 'eeeeeeeesssssssssssssssss======');
        this.updateChart(transformedData);
      } else {
        this.$message.error(res.msg);
      }
    },
    updateChart(data) {
      if (!this.chart) return;
      // 更新图表数据
      this.chart.changeData(data);
      // 关闭加载状态（如果有）
      this.chart.update({ loading: false });
    },
    
  },
}
</script>
<style>
</style>